<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- <script type="text/javascript"> -->
        <!-- /*
            在js中我们可以自己命名的都叫标识符
                变量名、函数名、属性名...
                可含有字母、数字、_、$，不以数字开头
        */

        /* 数据类型：String、Boolean、Null、Number（数值）、Underfind、Object(引用)
        Nan返回的是Number
        */
    //    var str = "hello";
    //    // 这里使用单引号和双引号都可以，但不要混着用,相同的不能嵌套，双引号里不能放双引号,可以放单引号
    //    var str2 = "我说\"今天天气真好~\"";
    //    document.write(str2);
    //    var str3 = 13.4;
    //    // 运算符 typeof 来检查变量类型
    //    document.write(typeof str3);

       // Null：表示为空的对象，返回类型为Object
       // Underfind：声明一个变量但没赋值时，他的值就是Underfind,返回Underfind


    //    类型转换：
    //         其他的转为字符串：调toString方法,不会影响到原变量  Null 和 Underfind 没有toString方法，不能调用
    //                          调String函数，a = String(str) :其他的是调toString方法，但是 Null 和 Underfind 转为 "Null" 和 "Underfind" 
    //         转Number：调Number()函数。纯数字的，转为数字；有非数字的转为NaN；空串或者全是空格的，转为0 
    
    // var b = str.toString();
    // b = SString(str);
    // document.write(typeof b);

    // 直接调用函数
    // (function(){
    //     alert("hello");
    // })();

    // var obj = {
    //         name : "marry",
    //         age : 12,
    // // 函数作为对象的属性，则成为对象的方法
    //         sayName : function(){
    //             document.write(obj.name);
    //         }
    // };
    // //for..in 遍历对象
    // for(var n in obj){
    //     document.write("属性名："+n);
    //     document.write("属性名："+obj[n])
    // }

    // // 数组：
    // var arr = ["jack","tom","marry","张三","李四"];
    // document.write(arr.slice(-3));// 包括开始，不包括结束索引
    //     // 只写一个参数：从传入的到结束 ；-1倒数第一个开始
    // arr.splice(0,2);// 对原数组有影响,开始位置 + 数量 ，从第0个索引开始删除2个
    // arr.splice(0,1,"牛魔王王","jack");// 删除、替换、插入
    // </script> -->
    <style>
        #box1{
            width: 100px;
            height: 100px;
            background-color: aquamarine;
        }
    </style>
    <script type="text/javascript">
        // window.onload = function(){
        //     /* 点击按钮修改box1的大小 */
        //     var box1 = document.getElementById("box1");
        //     var btn01 = document.getElementById("button1");
        //     btn01.onclick = function(){
        //         /* 修改样式 */
        //         box1.style.width = "200px";
        //         // 这里样式名含有"-"等，修改为驼峰式
        //         box1.style.backgroundColor = "purple";
        //     }
        // }

        window.onload = function(){
            /* 使box1跟随鼠标移动 */
            var box1 = document.getElementById("box1");
            box1.onmousemove = function(){
                
            }
        }
    </script>

</head>

<body>
    <!-- <button id="button1">点我一下</button>
    <br/>
    <br/> -->
    <div id="box1"></div>
</body>

</html>